<!DOCTYPE html>
<html>
<head>
  <script src="../OLLoader.js"></script>
  <script type="text/javascript">

    function test_constructor(t) {
        t.plan(5);

        var control = new OpenLayers.Control.Zoom();
        t.ok(control instanceof OpenLayers.Control, "instance of Control");
        t.ok(control instanceof OpenLayers.Control.Zoom, "instance of Zoom");
        t.eq(control.displayClass, "olControlZoom", "displayClass");
        control.destroy();
        
        control = new OpenLayers.Control.Zoom({
            zoomInText: "zoom in!",
            zoomOutText: "zoom out!"
        });
        t.eq(control.zoomInText, "zoom in!", "zoomInText");
        t.eq(control.zoomOutText, "zoom out!", "zoomOutText");
        control.destroy();        
    }

    function test_addControl(t) {
        t.plan(3);
        var map = new OpenLayers.Map("map");
        var control = new OpenLayers.Control.Zoom();
        map.addControl(control);
        t.ok(control.map === map, "Control.map set");
        t.ok(!!~OpenLayers.Util.indexOf(map.controls, control), "map.controls contains control");

        control = new OpenLayers.Control.Zoom({zoomInId: "in", zoomOutId: "out"});
        map.addControl(control);
        var eventsEl = document.getElementById("out").parentNode;
        t.ok(control.events.element === eventsEl, "Events instance listens to custom div's parentNode");

        map.destroy();
    }
    
    function test_zoomIn(t) {
        t.plan(2);
        
        var map = new OpenLayers.Map({
            div: "map",
            layers: [new OpenLayers.Layer(null, {isBaseLayer: true})]
        });
        var control = new OpenLayers.Control.Zoom();
        map.addControl(control);
        map.setCenter([0, 0], 0);
        
        t.eq(map.getZoom(), 0, "initial center");
        map.events.triggerEvent("buttonclick", {buttonElement: control.zoomInLink});
        t.eq(map.getZoom(), 1, "after zoom in");
        map.destroy();
    }

    function test_zoomOut(t) {
        t.plan(2);
        
        var map = new OpenLayers.Map({
            div: "map",
            layers: [new OpenLayers.Layer(null, {isBaseLayer: true})]
        });
        var control = new OpenLayers.Control.Zoom();
        map.addControl(control);
        map.setCenter([0, 0], 1);
        
        t.eq(map.getZoom(), 1, "initial center");
        map.events.triggerEvent("buttonclick", {buttonElement: control.zoomOutLink});
        t.eq(map.getZoom(), 0, "after zoom out");
        map.destroy();
    }

  </script>
</head>
<body>
    <div id="map" style="width: 512px; height: 256px;"/>
    <div id="in">in</div><div id="out">out</out>
</body>
</html>
